﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Areas/Website/Views/Shared/Master.Master"
    Inherits="System.Web.Mvc.ViewPage<ProductViewModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <div>
        <div class="cover">
            <img src="<%= string.Format("{0}/{1}/{2}",Model.ImageRoot,Model.ProductView.ProductId ,Model.ProductView.ImageName) %>"
                alt="" />
        </div>
        <div class="desc">
<%--            <h3>
                <%=Model.ProductView.ProductName %><%=Model.ProductView.ProductNo %></h3>
            <br />--%>
            <div>
                <%= Model.Details.Description %>
            </div>
        </div>
    </div>
    <div class="detalis">
        <div class="backHome">
            <a href="<%=Url.Action("Index","Home") %>">返回首页</a>
        </div>
        <ul class="setpBySetp">
            <li></li>
            <li><a href="#album">图片展示</a></li>
            <li><a href="#detail">产品特征</a></li>
            <li><a href="#packlist">规格参数</a></li>
            <li><a href="#fullsnap">3D展示</a></li>
            <li><a href="#service">服务支持</a></li>
            <li></li>
        </ul>
        <div id="detail">
            <%= Model.Details.Detail %>
        </div>
        <div id="album">
            <% foreach (EProductImage item in Model.ImageList)
               {
                   
            %>
            <a>
                <img src="<%= string.Format("{0}/{1}/{2}",Model.ImageRoot,Model.ProductView.ProductId ,item.ImageName) %>"
                    alt="" title="<%= item.Title %>" />
            </a>
            <%
                }
            %>
        </div>
        <div id="service">
            <%= Model.Details.Services %>
        </div>
        <div id="fullsnap">
            <%= Model.Details.FullSnap %>
        </div>
        <div id="packlist">
            <%= Model.Details.PackList %>
        </div>
    </div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="head" runat="server">
    <%= HtmlMetaHelper.HtmlTitle(Model.ProductView.ProductName,Model.ProductView.KeyWords,Model.ProductView.Description) %>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="cssLink" runat="server">
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="jsLink" runat="server">
</asp:Content>
<asp:Content ID="Content5" ContentPlaceHolderID="cssContent" runat="server">
    <style type="text/css">
        .setpBySetp a
        {
            color:#333;
        }
        .ui-state-active a
        {
            color:#740c7a;
        }
        .cover
        {
            margin-top: -20px;
            padding: 5px;
            float: left;
        }
        .desc
        {
            margin-left: 260px;
            margin-top: -30px;
            color: #333;
        }
        .cover img
        {
            width: 250px;
        }
        .detalis
        {
            clear: both;
            padding-top: 10px;
            line-height: 1.5;
            overflow-x: hidden;
        }
        #album a
        {
            cursor: pointer;
            border: 1px dotted #ccc;
            padding: 1px;
            display: block;
            float: left;
            margin: 2px;
            width: 23%;
        }
        #album a:hover
        {
            border: 1px solid #ccc;
        }
        #album img
        {
            width: 100%;
        }
        .backHome
        {
            margin-top: -6px;
        }
    </style>
</asp:Content>
<asp:Content ID="Content6" ContentPlaceHolderID="jsContent" runat="server">
    <script type="text/javascript">
        $(function () {
            $(".setpBySetp").tabs();
        });
    </script>
    <!--[if gt IE 6]>
    <script type="text/javascript">
        $(function () {
            $("#album img").live("click", function () {
                var dialog = $("<div class=\"textCenter\" title='" + this.title + "'>" + this.outerHTML + "</div>");
                dialog.dialog({ closeText: "×", modal: true, width: 680, close: function () { $(this).dialog("destroy"); dialog.remove(); } });
                dialog.click(function () { $(this).dialog("close"); });
            });
        });
    </script>
    <![endif]-->
</asp:Content>
